Component({
  data: {
    hide_good_box: false,
  },
  properties: {
    item: {
      type: Object,
      value: {},
    },
    feiBox: {
      type: String,
      value: "123",
    },
  },
  methods: {
    // 设置动画-三次贝塞尔曲线
    setAnimation(e) {
      // 第一步设置图片
      this.setData({
        feiBox: e.currentTarget.dataset.item.shop_pic,
      });
      // 第二步判断hide_good_box是否为true，good_box正在运动就不执行
      if (this.data.hide_good_box) return;
      // 第三步设置按下的位置、购物车的位置、顶部的位置
      // 当前点击位置的x，y坐标
      this.finger = {};
      var topPoint = {};
      this.finger["x"] = e.touches["0"].clientX;
      this.finger["y"] = e.touches["0"].clientY - 20;
      // 如果点击的位置小于购物车的位置，那么就让topPoint的y值等于点击的位置的y值，否则就让topPoint的y值等于购物车的y值
      if (this.finger["y"] < this.busPos["y"]) {
        topPoint["y"] = this.finger["y"] - 150;
      } else {
        topPoint["y"] = this.busPos["y"] - 150;
      }
      topPoint["x"] = (this.finger["x"] + this.busPos["x"]) / 2;
      // 第四步设置贝塞尔曲线的点
      this.linePos = this.bezier([this.finger, topPoint, this.busPos], 30);
      // 第五步开始动画
      this.startAnimation(e);
    },
    // 开始动画
    startAnimation(e) {
      var index = 0,
        that = this,
        bezier_points = that.linePos["bezier_points"];
      this.setData({
        hide_good_box: false,
        bus_x: that.finger["x"],
        bus_y: that.finger["y"],
      });
      
      this.timer = setInterval(function () {
        index++;
        that.setData({
          bus_x: bezier_points[index]["x"],
          bus_y: bezier_points[index]["y"],
        });
        if (index >= 28) {
          clearInterval(that.timer);
          that.setData({
            hide_good_box: true,
            hideCount: false,
            count: (that.data.count += 1),
          });
        }
      }, 33);
    },
    // 动画运动轨迹
    bezier: function (points, times) {
      // points是起点、控制点、终点的数组
      // times是运动次数
      // 返回的是运动轨迹的数组
      var points = JSON.parse(JSON.stringify(points));
      var len = points.length;
      var bezier_points = [];
      for (var t = 0; t < times + 1; t++) {
        var tmp = [];
        for (var i = 0; i < len; i++) {
          tmp[i] = JSON.parse(JSON.stringify(points[i]));
        }
        for (var j = 1; j < len; j++) {
          for (var i = 0; i < len - j; i++) {
            tmp[i].x = (1 - t / times) * tmp[i].x + (t / times) * tmp[i + 1].x;
            tmp[i].y = (1 - t / times) * tmp[i].y + (t / times) * tmp[i + 1].y;
          }
        }
        bezier_points.push({
          x: parseInt(tmp[0].x),
          y: parseInt(tmp[0].y),
        });
      }
      return {
        bezier_points: bezier_points,
      };
    },
  },
  lifetimes: {
    ready() {
      // 在组件在视图层布局完成后执行
      let ww = 0;
      let hh = 0;
      wx.getSystemInfo({
        success: function (res) {
          //可视窗口宽度
          ww = res.windowWidth;
          //可视窗口高度
          hh = res.windowHeight;
        },
      });
      //可视窗口x,y坐标
      this.busPos = {};
      this.busPos["x"] = 10;
      this.busPos["y"] = hh;
      this.setAnimation(this.data.item);
      setTimeout(()=>{
        this.triggerEvent('myevent', false)
      },1000)
    }
  },
});
